<%@ page contentType="text/html;charset=UTF-8" pageEncoding="UTF-8" session="false" %><%@
include file="/WEB-INF/jspf/import.jspf" %>
<!doctype HTML>
<html>
    <head>
        <meta http-equiv="content-type" content="text/html; charset=utf-8"/>
        <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
        <title>金币兑换_中国车友会_中国最大、最好的车友会平台</title>
        <meta name="keywords" content="" />
        <meta name="description" content="中国车友会礼品兑换-金币兑换、积分抽奖,丰富您的车友会生活" />
        <meta name="author" content="xieyongshuang_gz zhongqingbiao_gz"/>
        <link rel="stylesheet" type="text/css" href="http://js.3conline.com/wap/pcauto/2014/touch/club/club.css">
    </head>
    <body class="g-doc">
       <!--栏目计数器/文章计数器-->
         <jsp:include page="/template/wap/common/counter.jspf">
            <jsp:param name="channel" value="7841" />
        </jsp:include>
         <%@include file="../common/intf6007.html" %>
        <!-- 公共头部 -->
        <div class="g-hd">
            <a href="http://m.pcauto.com.cn" class="header-home" title="太平洋汽车网"></a>
            <div class="header-title">
                <span class="header-title-nav">
                    <a href="${WAPROOT}/">车友会</a> 
                    &gt; 金币兑换
                </span>
            </div>
        </div>
        <c:if test="${user==null || user.uid==0}">
            <div class="user-unlog">
                <a href="${UCWAPROOT}/passport/login.jsp?return=${WAPROOT}/duihuan/">
                    <p class="tit">点击登录</p>
                    <p class="des">登录后，才能享受金币兑换福利哦！</p>
                </a>
            </div>
        </c:if>
        <c:if test="${user!=null && user.uid>0}">
            <div class="g-user">
                <div class="user-info">
                    <img src="${f:face(user.uid,50)}">
                    <p class="tit">${user.username}</p>
                    <p class="gold">${gold}</p>
                </div>
                <div class="user-reco"><a href="${WAPROOT}/duihuan/record/">兑换记录 (<em id="reco-num">${countConversion}</em>)</a></div>
            </div>
        </c:if>

        <div class="m-gife-list" id ="giftItems">
            <c:forEach var="gift" items="${pager.resultList}" >
                <div class="m-gife-item">
                    <img src="${gift.giftUrl}" width="142" height="142">
                    <p class="tit">${gift.name}</p>
                    <p class="gold">${gift.gold}</p>
                    <c:if test="${gift.curNum==0}">
                        <p class="btn">缺货中</p>
                    </c:if>
                    <c:if test="${gift.curNum>0}">
                        <c:if test="${user==null || user.uid==0}"><p class="btn"><a href="${UCWAPROOT}/passport/login.jsp?return=${WAPROOT}/duihuan/">马上兑换</a></p></c:if>
                        <c:if test="${user!=null && user.uid>0}"><p class="btn"><a href="javascript:applyGift(${gift.giftId},${gift.gold});">马上兑换</a></p></c:if>
                    </c:if>
                </div>
            </c:forEach>
        </div> 
        <c:if test="${total>4}"> <div class="g-btn-more" onclick="loadMore();" id="loadMore"><a href="javascript:void(0)">点击加载更多兑换礼品 </a></div></c:if>
        <c:if test="${total<=4}"><div class="g-btn-more" id="loadMore">没有更多数据了...</div></c:if>
        <%@include file="/template/wap/gift/giftResult.jsp" %>
        <script type="text/javascript" src="http://js.3conline.com/wap/2013/common/js/zepto1.1.min.js" ></script>

        <script type="text/javascript">
            var pageNo = 2,
            loadFlag = true;
            var elem_bg=document.getElementById('j-g-mack');
            var elem_pop=document.getElementById('j-g-pop');
            elem_bg.style.height = document.documentElement.clientHeight + 70 + "px";
            var unlogin_elem_bg=document.getElementById('unlogin-j-g-mack');
            var unlogin_elem_pop=document.getElementById('unlogin-j-g-pop');
            unlogin_elem_bg.style.height = document.documentElement.clientHeight + 70 + "px";
            var unJoin_elem_bg=document.getElementById('unJoin-j-g-mack');
            var unJoin_elem_pop=document.getElementById('unJoin-j-g-pop');
            unJoin_elem_bg.style.height = document.documentElement.clientHeight + 70 + "px";
            var message_elem_bg=document.getElementById('message-j-g-mack');
            var message_elem_pop=document.getElementById('message-j-g-pop');
            message_elem_bg.style.height = document.documentElement.clientHeight + 70 + "px";
            function loadMore(){
                $("#loadMore").html("加载中...");
                $.getJSON("${WAPROOT}/gift/pageGift.do?req_enc=utf-8&resp_enc=utf-8&callback=?",{pageNo:pageNo,pageSize:4}, loadCallback);
            }
            function loadCallback(data){
                if(loadFlag){
                    if(data.data.length){
                        if(data.code==0){
                            var result = data .data;
                            var userId = parseInt("${user.uid}",0);
                            for(var i=0;i<result.length;i++){
                                var gift = result[i];
                                var html ='<div class="m-gife-item">'+
                                    '<img src="'+gift.giftUrl+'"width="142" height="142">'+
                                    '<p class="tit">'+gift.name+'</p>'+
                                    '<p class="gold">'+gift.gold+'</p>';
                                if(parseInt(gift.curNum,0)<=0){
                                    html +='<p class="btn">缺货中</p>'
                                }else{
                                    if(userId>0){
                                        html+='<p class="btn"><a href="javascript:applyGift('+gift.giftId+','+gift.gold+')">马上兑换</a> </p>';
                                    }else{
                                        html+='<p class="btn"><a href="${UCWAPROOT}/passport/login.jsp?return=${WAPROOT}/duihuan/">马上兑换</a></p>';
                                    }
                                }
                                html +='</div>';
                                $("#giftItems").append(html);    
                            }
                            if(data.pageCount>pageNo){
                                $("#loadMore").html("<a href='javascript:void(0)'>点击加载更多兑换礼品 </a>");
                            }else{
                                $("#loadMore").html("没有更多数据了...");
                                $("#loadMore").removeAttr("onclick");
                                loadFlag =false;
                            }
                            pageNo++;
                        }
                         
                    }else{
                        $("#loadMore").html("没有更多数据了...");
                        $("#loadMore").removeAttr("onclick");
                        loadFlag =false;
                    }
                }
            }
            var isApplyGift = false;
            function applyGift(giftId,gold){
                if(isApplyGift){
                   return; 
                }
                isApplyGift =true;
                $.getJSON("${TASKROOT}/intf/clubgc/getUserInfo.do?callback=?",{},function(data){
                    isApplyGift = false;
                    if(data.status == 0){
                        if(data.goldCount>=gold){
                            location.href="${WAPROOT}/gift/applyGift.do?giftId="+giftId;
                        }else{
                            $("#message").html("抱歉，您还差<em>" + (gold-data.goldCount) + "</em>金币");
                            message_elem_bg.style.display=message_elem_pop.style.display="block"; 
                        }
                    }
                });
            }
            function hidePopSuccess(){
                elem_bg.style.display=elem_pop.style.display="none";
                window.location.href="${WAPROOT}/duihuan/";
            }
            function hidePopUnlogin(){
                unlogin_elem_bg.style.display=unlogin_elem_pop.style.display="none";
            }
            function hidePopUnJoin(){
                unJoin_elem_bg.style.display=unJoin_elem_pop.style.display="none";
            }
            function hidePopMessage(){
                message_elem_bg.style.display=message_elem_pop.style.display="none";
            }
        </script>
        <div id="Jfoot" class="g-footer">
            <!-- 公共底部 -->
             <%@include file="../common/intf5987.html" %>
        </div>
    </body>
</html>